<p><a href="https://blog.mozilla.org/security/2016/08/26/mitigating-mime-confusion-attacks-in-firefox/">MIME confusion</a> attacks occur when an
attacker successfully tricks a web-browser to interpret a resource as a different type than the one expected. To correctly interpret a resource
(script, image, stylesheet …​) web browsers look for the <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Type">Content-Type
header</a> defined in the HTTP response received from the server, but often this header is not set or is set with an incorrect value. To avoid
content-type mismatch and to provide the best user experience, web browsers try to deduce the right content-type, generally by inspecting the content
of the resources (the first bytes). This "guess mechanism" is called <a href="https://en.wikipedia.org/wiki/Content_sniffing">MIME type
sniffing</a>.</p>
<p>Attackers can take advantage of this feature when a website ("example.com" here) allows to upload arbitrary files. In that case, an attacker can
upload a malicious image <em>fakeimage.png</em> (containing malicious JavaScript code or <a
href="https://docs.microsoft.com/fr-fr/archive/blogs/ieinternals/script-polyglots">a polyglot content</a> file) such as:</p>
<pre>
&lt;script&gt;alert(document.cookie)&lt;/script&gt;
</pre>
<p>When the victim will visit the website showing the uploaded image, the malicious script embedded into the image will be executed by web browsers
performing MIME type sniffing.</p>
<h2>Ask Yourself Whether</h2>
<ul>
  <li> <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Type">Content-Type</a> header is not systematically set for all
  resources. </li>
  <li> Content of resources can be controlled by users. </li>
</ul>
<p>There is a risk if you answered yes to any of those questions.</p>
<h2>Recommended Secure Coding Practices</h2>
<p>Implement <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Content-Type-Options">X-Content-Type-Options</a> header with
<em>nosniff</em> value (the only existing value for this header) which is supported by all modern browsers and will prevent browsers from performing
MIME type sniffing, so that in case of Content-Type header mismatch, the resource is not interpreted. For example within a &lt;script&gt; object
context, JavaScript MIME types are expected (like <em>application/javascript</em>) in the Content-Type header.</p>
<h2>Sensitive Code Example</h2>
<p>In Express.js application the code is sensitive if, when using <a href="https://www.npmjs.com/package/helmet">helmet</a>, the <code>noSniff</code>
middleware is disabled:</p>
<pre>
const express = require('express');
const helmet = require('helmet');

let app = express();

app.use(
  helmet({
    noSniff: false, // Sensitive
  })
);
</pre>
<h2>Compliant Solution</h2>
<p>When using <code>helmet</code> in an Express.js application, the <code>noSniff</code> middleware should be enabled (it is also done by
default):</p>
<pre>
const express = require('express');
const helmet= require('helmet');

let app = express();

app.use(helmet.noSniff());
</pre>
<h2>See</h2>
<ul>
  <li> OWASP - <a href="https://owasp.org/Top10/A05_2021-Security_Misconfiguration/">Top 10 2021 Category A5 - Security Misconfiguration</a> </li>
  <li> OWASP - <a href="https://owasp.org/www-project-top-ten/2017/A6_2017-Security_Misconfiguration">Top 10 2017 Category A6 - Security
  Misconfiguration</a> </li>
  <li> <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Content-Type-Options">developer.mozilla.org</a> - X-Content-Type-Options
  </li>
  <li> <a href="https://blog.mozilla.org/security/2016/08/26/mitigating-mime-confusion-attacks-in-firefox/">blog.mozilla.org</a> - Mitigating MIME
  Confusion Attacks in Firefox </li>
</ul>
